$(function() {
	// 供应商的数据绑定
	var roleVue = new Vue({
		el : '#roleDiv',
		data : {
			items : null
		},
		methods : {
			// 编辑按钮的点击
			editItem : function(item) {
				openEdituserBox(item);
			},
			// 删除按钮的点击
			deleteItem : function(item) {
				openDeleteConfirm(item);
			},
			setPermission : function(item) {
				openChoosePermissionBox(item);
			}
		}
	});
	// ajax 获得所有的用户
	getAllRole();

	$("#createRoleButton").on("click", function() {
		openCreateRoleBox();
	});

	// 打开选择权限的box
	function openChoosePermissionBox(item) {
		var choosePermissionBox = layer
				.open({
					type : 2,
					maxmin : true,
					title : '选择权限',
					offset : '4%',
					area : [ '70%', '92%' ],
					btn : [ '确定', '取消' ] // 只是为了演示
					,
					yes : function() {
						// 获得子窗口的值
						var childBox = layer.getChildFrame('body',
								choosePermissionBox);

						// 获得form表单的数据
						var data = childBox.find("#permissionForm").serialize();

						$.post(SERVER_PRE_URL+"permission/updatePermissionByRoleIdAjax", data,
								function(result, status) {
									if (result == 1) {
										layer.msg('操作成功');
										layer.close(choosePermissionBox);
									} else {
										layer.msg('操作失败');
									}
								});

					},
					btn2 : function() {
						layer.close();
					},
					shadeClose : true, // 点击遮罩关闭
					content : SERVER_PRE_URL
							+ 'permission/getPermissionByRoleIdReturnTo?returnTo=choosePermission&roleId='
							+ item.roleId
				});

	}

	function openCreateRoleBox() {
		layer.prompt({
			title : '新建角色',
			formType : 3
		}, function(text, index) {
			if (text == null || text == "") {
				layer.msg('角色名不能为空');
			} else {
				$.post(SERVER_PRE_URL + "role/createNewRoleAjax", {
					"roleName" : text
				}, function(result) {
					if (result == 1) {
						layer.msg('创建角色成功');
						layer.close(index);
						getAllRole();
					} else {
						layer.msg('创建角色失败');
					}
				});
			}
		});
	}

	function openEdituserBox(role) {
		layer.prompt({
			title : '修改角色:' + role.roleName,
			value : role.roleName,
			formType : 3
		}, function(text, index) {
			if (text == null || text == "") {
				layer.msg('角色名不能为空');
			} else {
				var data = {
					"roleId" : role.roleId,
					"roleName" : text
				};
				$.post(SERVER_PRE_URL + "role/updateRoleNameAjax", data,
						function(result) {
							if (result == 1) {
								layer.msg('修改角色成功');
								layer.close(index);
								getAllRole();
							} else {
								layer.msg('修改角色失败');
							}
						});
			}
		});

	}

	function openDeleteConfirm(item) {
		// 询问框
		layer.confirm('确认删除：' + item.roleName, {
			offset : '20%',
			btn : [ '确认', '取消' ]
		// 按钮
		}, function() {
			deleteuserDetail(item.roleId);
		}, function() {
		});
	}

	function deleteuserDetail(roleId) {
		var data = {
			"roleId" : roleId
		};
		baseUtil.httpSend("role/deleteRoleByRoleIdAjax", data,
				showUpdatedDataByResult);
	}

	function showUpdatedDataByResult(result) {
		if (result == 1) {
			getAllRole();
			layer.msg('操作成功');
		} else {
			layer.msg('操作失败');
		}
	}

	function getAllRole() {
		baseUtil.httpSend("role/getAllRoleAjax", null, showuserData);
	}

	function showuserData(data) {
		roleVue.items = data;
	}

});